<template>
	<view class="" style="background-color: #fff;">
		<newNavBar></newNavBar>
		<uni-forms ref="baseForm" :modelValue="baseFormData" class="content" label-position="left">
			<uni-forms-item label="条码号" name="tempCode" :labelWidth="labelWidth">
				<view style="display: flex;align-items: center;">
					<uni-easyinput type="text" v-model="scanBarCode" :focus="true" placeholder="请输入条码号"
						@confirm="scanInput" />
					<uni-icons type="scan" size="27" style="margin-left: 6px;" @click="iconClick" />
				</view>
			</uni-forms-item>
			<uni-forms-item>
				<uni-steps @click="stepsClick" :options="stepsList" active-color="#42b983" 
					direction="column" />
			</uni-forms-item>
		</uni-forms>


		<!-- <text>入库界面</text> -->
	</view>
</template>

<script>
	import * as SystemJs from '../../common/system.js'
	import * as configJs from '../../common/config.js'
	import InStorage from '../business/InStorage.vue'
	export default {
		components: {
			InStorage
		},
		data() {
			return {
				pageCode: '',
				labelWidth: '90', //label标签的宽度
				scanBarCode: '',
				stepsList: [],
				list2: [{
					id: 123,
					title: '条码出库',
					content: '出库仓库：02成品库；出库人员：管理员',
					desc: '2018-11-14 13:20:22'
				}, {
					id: 123,
					title: '条码检验',
					content: '检测人员：管理员',
					desc: '2018-11-13 15:13:40'
				}, {
					id: 123,
					title: '条码入库',
					content: '入库仓库：02成品库；入库人员：管理员',
					desc: '2018-11-12 11:12:20'
				}, {
					id: 123,
					title: '条码打印',
					content: '生产人员：管理员',
					desc: '2018-11-11 18:30:30'
				}],
				baseFormData: {
					tempCode: '',
					wareHouse: '',
					depCode: '',
					typeCode: '',
					blue: 1,
					date: ''
				},
				range: [{
						value: 0,
						text: "篮球"
					},
					{
						value: 1,
						text: "足球"
					},
					{
						value: 2,
						text: "游泳"
					},
				],
				blueList: [{
					value: 1,
					text: '蓝单'
				}, {
					value: 0,
					text: '红单'
				}]
			}
		},
		onLoad(res) {
			this.pageCode = res.pageCode;
			SystemJs.systemJs.showTitleBar(res.pageName, true)
		},
		methods: {
			scanInput(e) {
				this.loadData();
				// this.stepsList = this.list2;
			},
			//步骤条点击事件
			stepsClick(e) {
				console.log("e:", e);
				// console.log("listItem:", this.list2[e.index]);
				// uni.showToast({
				// 	title: e.index,
				// })
			},
			//点击扫描按钮
			iconClick(type) {
				uni.scanCode({
					scanType: ['barCode', 'qrCode'],
					success: (res) => {
						this.scanBarCode = res.result;
						this.loadData();
						console.log("e:", res.result);
					},
					fail: (res) => {
						console.log("e:", res);
					}
				})
				// uni.showToast({
				// 	title: `点击了图标`,
				// 	icon: 'none'
				// })
			},
			/**
			 * 获取列表信息
			 */
			loadData(isFirst = true) {
				var obj = {};
				obj.barCode = this.scanBarCode;
				obj.baseCode = uni.getStorageSync('account');
				obj.inOutType = this.pageCode;
				obj.mobType = "H5";
				SystemJs.httpUnit.requestCryptoPost({
					url: 'App/TrackBarCodeInfo',
					data: obj
				}).then((res) => {
					if (res.Result) {
						this.stepsList = res.Data;
						this.scanBarCode = "";
					} else {
						SystemJs.httpUnit.uniToast(res.Message)
					}
				}).catch((err) => {
					SystemJs.httpUnit.uniToast(JSON.stringify(err))
				})
			}
		}
	}
</script>

<style>
	.content {
		padding: 15px;
	}

	.form-item {
		display: flex;
		align-items: center;
	}
</style>
